import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  /* for init an empty var array */
  actualPageRowsList = [];

  /* backwardDisable is for back button of page number when stay on
     first page number*/
  backwardDisable = 'disabled';

  /* forwardDisable is for next button of page number when stay on
     last page number */
  forwardDisable = 'enabled';

  /* for init an 0 var totalOfPages number */
  totalOfPages = 0;

  /* for run page on the first page result */
  pageNum = 1;
  /* pag is acronimous of 'pagination' */
  pagNumOfRowsByPage = 20;


  /* emulate call to database for count the total rows of the
     response */
  rowsTotal = 142;

  /* emulate call to database for list the pages response */
  namesList = {
    "page1": [
      {
        "row_number": 1,
        "first_name": "Mark1",
        "last_name": "Otto1",
        "nick_name": "@mdo1"
      },
      {
        "row_number": 2,
        "first_name": "Mark2",
        "last_name": "Otto2",
        "nick_name": "@mdo2"
      },
      {
        "row_number": 3,
        "first_name": "Mark3",
        "last_name": "Otto3",
        "nick_name": "@mdo3"
      },
      {
        "row_number": 4,
        "first_name": "Mark4",
        "last_name": "Otto4",
        "nick_name": "@mdo4"
      },
      {
        "row_number": 5,
        "first_name": "Mark5",
        "last_name": "Otto5",
        "nick_name": "@mdo5"
      },
      {
        "row_number": 6,
        "first_name": "Mark6",
        "last_name": "Otto6",
        "nick_name": "@mdo6"
      },
      {
        "row_number": 7,
        "first_name": "Mark7",
        "last_name": "Otto7",
        "nick_name": "@mdo7"
      },
      {
        "row_number": 8,
        "first_name": "Mark8",
        "last_name": "Otto8",
        "nick_name": "@mdo8"
      },
      {
        "row_number": 9,
        "first_name": "Mark9",
        "last_name": "Otto9",
        "nick_name": "@mdo9"
      },
      {
        "row_number": 10,
        "first_name": "Mark10",
        "last_name": "Otto10",
        "nick_name": "@mdo10"
      },
      {
        "row_number": 11,
        "first_name": "Mark11",
        "last_name": "Otto11",
        "nick_name": "@mdo11"
      },
      {
        "row_number": 12,
        "first_name": "Mark12",
        "last_name": "Otto12",
        "nick_name": "@mdo12"
      },
      {
        "row_number": 13,
        "first_name": "Mark13",
        "last_name": "Otto13",
        "nick_name": "@mdo13"
      },
      {
        "row_number": 14,
        "first_name": "Mark14",
        "last_name": "Otto14",
        "nick_name": "@mdo14"
      },
      {
        "row_number": 15,
        "first_name": "Mark15",
        "last_name": "Otto15",
        "nick_name": "@mdo15"
      },
      {
        "row_number": 16,
        "first_name": "Mark16",
        "last_name": "Otto16",
        "nick_name": "@mdo16"
      },
      {
        "row_number": 17,
        "first_name": "Mark17",
        "last_name": "Otto17",
        "nick_name": "@mdo17"
      },
      {
        "row_number": 18,
        "first_name": "Mark18",
        "last_name": "Otto18",
        "nick_name": "@mdo18"
      },
      {
        "row_number": 19,
        "first_name": "Mark19",
        "last_name": "Otto19",
        "nick_name": "@mdo19"
      },
      {
        "row_number": 20,
        "first_name": "Mark20",
        "last_name": "Otto20",
        "nick_name": "@mdo20"
      }
    ],
    "page2": [
      {
        "row_number": 21,
        "first_name": "Mark21",
        "last_name": "Otto21",
        "nick_name": "@mdo21"
      },
      {
        "row_number": 22,
        "first_name": "Mark22",
        "last_name": "Otto22",
        "nick_name": "@mdo22"
      },
      {
        "row_number": 23,
        "first_name": "Mark23",
        "last_name": "Otto23",
        "nick_name": "@mdo23"
      },
      {
        "row_number": 24,
        "first_name": "Mark24",
        "last_name": "Otto24",
        "nick_name": "@mdo24"
      },
      {
        "row_number": 25,
        "first_name": "Mark25",
        "last_name": "Otto25",
        "nick_name": "@mdo25"
      },
      {
        "row_number": 26,
        "first_name": "Mark26",
        "last_name": "Otto26",
        "nick_name": "@mdo26"
      },
      {
        "row_number": 27,
        "first_name": "Mark27",
        "last_name": "Otto27",
        "nick_name": "@mdo27"
      },
      {
        "row_number": 28,
        "first_name": "Mark28",
        "last_name": "Otto28",
        "nick_name": "@mdo28"
      },
      {
        "row_number": 29,
        "first_name": "Mark29",
        "last_name": "Otto29",
        "nick_name": "@mdo29"
      },
      {
        "row_number": 30,
        "first_name": "Mark30",
        "last_name": "Otto30",
        "nick_name": "@mdo30"
      },
      {
        "row_number": 31,
        "first_name": "Mark31",
        "last_name": "Otto31",
        "nick_name": "@mdo31"
      },
      {
        "row_number": 32,
        "first_name": "Mark32",
        "last_name": "Otto32",
        "nick_name": "@mdo32"
      },
      {
        "row_number": 33,
        "first_name": "Mark33",
        "last_name": "Otto33",
        "nick_name": "@mdo33"
      },
      {
        "row_number": 34,
        "first_name": "Mark34",
        "last_name": "Otto34",
        "nick_name": "@mdo34"
      },
      {
        "row_number": 35,
        "first_name": "Mark35",
        "last_name": "Otto35",
        "nick_name": "@mdo35"
      },
      {
        "row_number": 36,
        "first_name": "Mark36",
        "last_name": "Otto36",
        "nick_name": "@mdo36"
      },
      {
        "row_number": 37,
        "first_name": "Mark37",
        "last_name": "Otto37",
        "nick_name": "@mdo37"
      },
      {
        "row_number": 38,
        "first_name": "Mark38",
        "last_name": "Otto38",
        "nick_name": "@mdo38"
      },
      {
        "row_number": 39,
        "first_name": "Mark39",
        "last_name": "Otto39",
        "nick_name": "@mdo39"
      },
      {
        "row_number": 40,
        "first_name": "Mark40",
        "last_name": "Otto40",
        "nick_name": "@mdo40"
      }
    ],
    "page3": [
      {
        "row_number": 41,
        "first_name": "Mark41",
        "last_name": "Otto41",
        "nick_name": "@mdo41"
      },
      {
        "row_number": 42,
        "first_name": "Mark42",
        "last_name": "Otto42",
        "nick_name": "@mdo42"
      },
      {
        "row_number": 43,
        "first_name": "Mark43",
        "last_name": "Otto43",
        "nick_name": "@mdo43"
      },
      {
        "row_number": 44,
        "first_name": "Mark44",
        "last_name": "Otto44",
        "nick_name": "@mdo44"
      },
      {
        "row_number": 45,
        "first_name": "Mark45",
        "last_name": "Otto45",
        "nick_name": "@mdo45"
      },
      {
        "row_number": 46,
        "first_name": "Mark46",
        "last_name": "Otto46",
        "nick_name": "@mdo46"
      },
      {
        "row_number": 47,
        "first_name": "Mark47",
        "last_name": "Otto47",
        "nick_name": "@mdo47"
      },
      {
        "row_number": 48,
        "first_name": "Mark48",
        "last_name": "Otto48",
        "nick_name": "@mdo48"
      },
      {
        "row_number": 49,
        "first_name": "Mark49",
        "last_name": "Otto49",
        "nick_name": "@mdo49"
      },
      {
        "row_number": 50,
        "first_name": "Mark50",
        "last_name": "Otto50",
        "nick_name": "@mdo50"
      },
      {
        "row_number": 51,
        "first_name": "Mark51",
        "last_name": "Otto51",
        "nick_name": "@mdo51"
      },
      {
        "row_number": 52,
        "first_name": "Mark52",
        "last_name": "Otto52",
        "nick_name": "@mdo52"
      },
      {
        "row_number": 53,
        "first_name": "Mark53",
        "last_name": "Otto53",
        "nick_name": "@mdo53"
      },
      {
        "row_number": 54,
        "first_name": "Mark54",
        "last_name": "Otto54",
        "nick_name": "@mdo54"
      },
      {
        "row_number": 55,
        "first_name": "Mark55",
        "last_name": "Otto55",
        "nick_name": "@mdo55"
      },
      {
        "row_number": 56,
        "first_name": "Mark56",
        "last_name": "Otto56",
        "nick_name": "@mdo56"
      },
      {
        "row_number": 57,
        "first_name": "Mark57",
        "last_name": "Otto57",
        "nick_name": "@mdo57"
      },
      {
        "row_number": 58,
        "first_name": "Mark58",
        "last_name": "Otto58",
        "nick_name": "@mdo58"
      },
      {
        "row_number": 59,
        "first_name": "Mark59",
        "last_name": "Otto59",
        "nick_name": "@mdo59"
      },
      {
        "row_number": 60,
        "first_name": "Mark60",
        "last_name": "Otto60",
        "nick_name": "@mdo60"
      }
    ],
    "page4": [
      {
        "row_number": 61,
        "first_name": "Mark61",
        "last_name": "Otto61",
        "nick_name": "@mdo61"
      },
      {
        "row_number": 62,
        "first_name": "Mark62",
        "last_name": "Otto62",
        "nick_name": "@mdo62"
      },
      {
        "row_number": 63,
        "first_name": "Mark63",
        "last_name": "Otto63",
        "nick_name": "@mdo63"
      },
      {
        "row_number": 64,
        "first_name": "Mark64",
        "last_name": "Otto64",
        "nick_name": "@mdo64"
      },
      {
        "row_number": 65,
        "first_name": "Mark65",
        "last_name": "Otto65",
        "nick_name": "@mdo65"
      },
      {
        "row_number": 66,
        "first_name": "Mark66",
        "last_name": "Otto66",
        "nick_name": "@mdo66"
      },
      {
        "row_number": 67,
        "first_name": "Mark67",
        "last_name": "Otto67",
        "nick_name": "@mdo67"
      },
      {
        "row_number": 68,
        "first_name": "Mark68",
        "last_name": "Otto68",
        "nick_name": "@mdo68"
      },
      {
        "row_number": 69,
        "first_name": "Mark69",
        "last_name": "Otto69",
        "nick_name": "@mdo69"
      },
      {
        "row_number": 70,
        "first_name": "Mark70",
        "last_name": "Otto70",
        "nick_name": "@mdo70"
      },
      {
        "row_number": 71,
        "first_name": "Mark71",
        "last_name": "Otto71",
        "nick_name": "@mdo71"
      },
      {
        "row_number": 72,
        "first_name": "Mark72",
        "last_name": "Otto72",
        "nick_name": "@mdo72"
      },
      {
        "row_number": 73,
        "first_name": "Mark73",
        "last_name": "Otto73",
        "nick_name": "@mdo73"
      },
      {
        "row_number": 74,
        "first_name": "Mark74",
        "last_name": "Otto74",
        "nick_name": "@mdo74"
      },
      {
        "row_number": 75,
        "first_name": "Mark75",
        "last_name": "Otto75",
        "nick_name": "@mdo75"
      },
      {
        "row_number": 76,
        "first_name": "Mark76",
        "last_name": "Otto76",
        "nick_name": "@mdo76"
      },
      {
        "row_number": 77,
        "first_name": "Mark77",
        "last_name": "Otto77",
        "nick_name": "@mdo77"
      },
      {
        "row_number": 78,
        "first_name": "Mark78",
        "last_name": "Otto78",
        "nick_name": "@mdo78"
      },
      {
        "row_number": 79,
        "first_name": "Mark79",
        "last_name": "Otto79",
        "nick_name": "@mdo79"
      },
      {
        "row_number": 80,
        "first_name": "Mark80",
        "last_name": "Otto80",
        "nick_name": "@mdo80"
      }
    ],
    "page5": [
      {
        "row_number": 81,
        "first_name": "Mark81",
        "last_name": "Otto81",
        "nick_name": "@mdo81"
      },
      {
        "row_number": 82,
        "first_name": "Mark82",
        "last_name": "Otto82",
        "nick_name": "@mdo82"
      },
      {
        "row_number": 83,
        "first_name": "Mark83",
        "last_name": "Otto83",
        "nick_name": "@mdo83"
      },
      {
        "row_number": 84,
        "first_name": "Mark84",
        "last_name": "Otto84",
        "nick_name": "@mdo84"
      },
      {
        "row_number": 85,
        "first_name": "Mark85",
        "last_name": "Otto85",
        "nick_name": "@mdo85"
      },
      {
        "row_number": 86,
        "first_name": "Mark86",
        "last_name": "Otto86",
        "nick_name": "@mdo86"
      },
      {
        "row_number": 87,
        "first_name": "Mark87",
        "last_name": "Otto87",
        "nick_name": "@mdo87"
      },
      {
        "row_number": 88,
        "first_name": "Mark88",
        "last_name": "Otto88",
        "nick_name": "@mdo88"
      },
      {
        "row_number": 89,
        "first_name": "Mark89",
        "last_name": "Otto89",
        "nick_name": "@mdo89"
      },
      {
        "row_number": 90,
        "first_name": "Mark90",
        "last_name": "Otto90",
        "nick_name": "@mdo90"
      },
      {
        "row_number": 91,
        "first_name": "Mark91",
        "last_name": "Otto91",
        "nick_name": "@mdo91"
      },
      {
        "row_number": 92,
        "first_name": "Mark92",
        "last_name": "Otto92",
        "nick_name": "@mdo92"
      },
      {
        "row_number": 93,
        "first_name": "Mark93",
        "last_name": "Otto93",
        "nick_name": "@mdo93"
      },
      {
        "row_number": 94,
        "first_name": "Mark94",
        "last_name": "Otto94",
        "nick_name": "@mdo94"
      },
      {
        "row_number": 95,
        "first_name": "Mark95",
        "last_name": "Otto95",
        "nick_name": "@mdo95"
      },
      {
        "row_number": 96,
        "first_name": "Mark96",
        "last_name": "Otto96",
        "nick_name": "@mdo96"
      },
      {
        "row_number": 97,
        "first_name": "Mark97",
        "last_name": "Otto97",
        "nick_name": "@mdo97"
      },
      {
        "row_number": 98,
        "first_name": "Mark98",
        "last_name": "Otto98",
        "nick_name": "@mdo98"
      },
      {
        "row_number": 99,
        "first_name": "Mark99",
        "last_name": "Otto99",
        "nick_name": "@mdo99"
      },
      {
        "row_number": 100,
        "first_name": "Mark100",
        "last_name": "Otto100",
        "nick_name": "@mdo100"
      }
    ],
    "page6": [
      {
        "row_number": 101,
        "first_name": "Mark101",
        "last_name": "Otto101",
        "nick_name": "@mdo101"
      },
      {
        "row_number": 102,
        "first_name": "Mark102",
        "last_name": "Otto102",
        "nick_name": "@mdo102"
      },
      {
        "row_number": 103,
        "first_name": "Mark103",
        "last_name": "Otto103",
        "nick_name": "@mdo103"
      },
      {
        "row_number": 104,
        "first_name": "Mark104",
        "last_name": "Otto104",
        "nick_name": "@mdo104"
      },
      {
        "row_number": 105,
        "first_name": "Mark105",
        "last_name": "Otto105",
        "nick_name": "@mdo105"
      },
      {
        "row_number": 106,
        "first_name": "Mark106",
        "last_name": "Otto106",
        "nick_name": "@mdo106"
      },
      {
        "row_number": 107,
        "first_name": "Mark107",
        "last_name": "Otto107",
        "nick_name": "@mdo107"
      },
      {
        "row_number": 108,
        "first_name": "Mark108",
        "last_name": "Otto108",
        "nick_name": "@mdo108"
      },
      {
        "row_number": 109,
        "first_name": "Mark109",
        "last_name": "Otto109",
        "nick_name": "@mdo109"
      },
      {
        "row_number": 110,
        "first_name": "Mark110",
        "last_name": "Otto110",
        "nick_name": "@mdo110"
      },
      {
        "row_number": 111,
        "first_name": "Mark111",
        "last_name": "Otto111",
        "nick_name": "@mdo111"
      },
      {
        "row_number": 112,
        "first_name": "Mark112",
        "last_name": "Otto112",
        "nick_name": "@mdo112"
      },
      {
        "row_number": 113,
        "first_name": "Mark113",
        "last_name": "Otto113",
        "nick_name": "@mdo113"
      },
      {
        "row_number": 114,
        "first_name": "Mark114",
        "last_name": "Otto114",
        "nick_name": "@mdo114"
      },
      {
        "row_number": 115,
        "first_name": "Mark115",
        "last_name": "Otto115",
        "nick_name": "@mdo115"
      },
      {
        "row_number": 116,
        "first_name": "Mark116",
        "last_name": "Otto116",
        "nick_name": "@mdo116"
      },
      {
        "row_number": 117,
        "first_name": "Mark117",
        "last_name": "Otto117",
        "nick_name": "@mdo117"
      },
      {
        "row_number": 118,
        "first_name": "Mark118",
        "last_name": "Otto118",
        "nick_name": "@mdo118"
      },
      {
        "row_number": 119,
        "first_name": "Mark119",
        "last_name": "Otto119",
        "nick_name": "@mdo119"
      },
      {
        "row_number": 120,
        "first_name": "Mark120",
        "last_name": "Otto120",
        "nick_name": "@mdo120"
      }
    ],
    "page7": [
      {
        "row_number": 121,
        "first_name": "Mark121",
        "last_name": "Otto121",
        "nick_name": "@mdo121"
      },
      {
        "row_number": 122,
        "first_name": "Mark122",
        "last_name": "Otto122",
        "nick_name": "@mdo122"
      },
      {
        "row_number": 123,
        "first_name": "Mark123",
        "last_name": "Otto123",
        "nick_name": "@mdo123"
      },
      {
        "row_number": 124,
        "first_name": "Mark124",
        "last_name": "Otto124",
        "nick_name": "@mdo124"
      },
      {
        "row_number": 125,
        "first_name": "Mark125",
        "last_name": "Otto125",
        "nick_name": "@mdo125"
      },
      {
        "row_number": 126,
        "first_name": "Mark126",
        "last_name": "Otto126",
        "nick_name": "@mdo126"
      },
      {
        "row_number": 127,
        "first_name": "Mark127",
        "last_name": "Otto127",
        "nick_name": "@mdo127"
      },
      {
        "row_number": 128,
        "first_name": "Mark128",
        "last_name": "Otto128",
        "nick_name": "@mdo128"
      },
      {
        "row_number": 129,
        "first_name": "Mark129",
        "last_name": "Otto129",
        "nick_name": "@mdo129"
      },
      {
        "row_number": 130,
        "first_name": "Mark130",
        "last_name": "Otto130",
        "nick_name": "@mdo130"
      },
      {
        "row_number": 131,
        "first_name": "Mark131",
        "last_name": "Otto131",
        "nick_name": "@mdo131"
      },
      {
        "row_number": 132,
        "first_name": "Mark132",
        "last_name": "Otto132",
        "nick_name": "@mdo132"
      },
      {
        "row_number": 133,
        "first_name": "Mark133",
        "last_name": "Otto133",
        "nick_name": "@mdo133"
      },
      {
        "row_number": 134,
        "first_name": "Mark134",
        "last_name": "Otto134",
        "nick_name": "@mdo134"
      },
      {
        "row_number": 135,
        "first_name": "Mark135",
        "last_name": "Otto135",
        "nick_name": "@mdo135"
      },
      {
        "row_number": 136,
        "first_name": "Mark136",
        "last_name": "Otto136",
        "nick_name": "@mdo136"
      },
      {
        "row_number": 137,
        "first_name": "Mark137",
        "last_name": "Otto137",
        "nick_name": "@mdo137"
      },
      {
        "row_number": 138,
        "first_name": "Mark138",
        "last_name": "Otto138",
        "nick_name": "@mdo138"
      },
      {
        "row_number": 139,
        "first_name": "Mark139",
        "last_name": "Otto139",
        "nick_name": "@mdo139"
      },
      {
        "row_number": 140,
        "first_name": "Mark140",
        "last_name": "Otto140",
        "nick_name": "@mdo140"
      }
    ],
    "page8": [
      {
        "row_number": 141,
        "first_name": "Mark141",
        "last_name": "Otto141",
        "nick_name": "@mdo141"
      },
      {
        "row_number": 142,
        "first_name": "Mark142",
        "last_name": "Otto142",
        "nick_name": "@mdo142"
      }
    ]
  };

  ngOnInit() {
    this.describe(false);
    this.totalOfPages = this.numberOfPages(this.pagNumOfRowsByPage,this.rowsTotal);
    this.emulateDataBaseListCall(this.pagNumOfRowsByPage,this.rowsTotal,this.pageNum);
  }

  numberOfPages(pagNumOfRowsByPage,rowsTotal) {
    var re = /^[-+]?[0-9]+\.[0-9]+$/;
    var divideResult = (rowsTotal / pagNumOfRowsByPage);
    var isDecimal = divideResult.toString().match( re );

    if(isDecimal){
      return Number(~~divideResult + 1);
    }

    return divideResult;
  }

  counter(i: number) {
    return new Array(i);
  }

  emulateDataBaseListCall(pagNumOfRowsByPage,rowsTotal,pageNum) {

    if(pageNum === '-') {
      if(this.pageNum >= 2) {
        pageNum = (this.pageNum - 1);
      }
      else {
        return;
      }
    }

    if(pageNum === '+') {
      if(this.pageNum < this.totalOfPages) {
        pageNum = (this.pageNum + 1);
      }
      else {
        return;
      }
    }

    this.beDisabledNextAndBackButton(pageNum);

    switch (pageNum) {
      case 1:
        this.actualPageRowsList = this.namesList.page1;
        break;
      case 2:
        this.actualPageRowsList = this.namesList.page2;
        break;
      case 3:
        this.actualPageRowsList = this.namesList.page3;
        break;
      case 4:
        this.actualPageRowsList = this.namesList.page4;
        break;
      case 5:
        this.actualPageRowsList = this.namesList.page5;
        break;
      case 6:
        this.actualPageRowsList = this.namesList.page6;
        break;
      case 7:
        this.actualPageRowsList = this.namesList.page7;
        break;
      case 8:
        this.actualPageRowsList = this.namesList.page8;
        break;
      default:
        this.actualPageRowsList = [];
        break;
    }

    this.beActivePageNumber(pageNum);
  }

  describe(print) {
    if(print) {
      console.log('↓ filas por pagina:')
      console.log(this.pagNumOfRowsByPage);

      console.log('↓ total de filas:')
      console.log(this.rowsTotal);

      console.log('↓ nro de páginas:')
      console.log('si el calculo del total de filas entre ' +
                  'las filas por páginas:');

      var re = /^[-+]?[0-9]+\.[0-9]+$/;

      var divideResult = (this.rowsTotal / this.pagNumOfRowsByPage);

      var isDecimal = divideResult.toString().match( re );

      if(isDecimal){
        console.log('es decimal (' + divideResult.toString() +
                    '), se remueve la parte decimal y se '   +
                    'suma una página automáticamente ('      +
                    (~~divideResult + 1)                     +
                    ')'
                   );
      }

      if(!isDecimal){
        console.log('no es decimal, no se suma una página automáticamente');
      }

      console.log('↓ lista emulada de nombres:')
      console.log(this.namesList);
      console.log('^ objeto json que emula respuesta de 8 páginas ' +
                  'la base de datos.');

      console.log('\n\n\n\n');
    }
  }

  beActivePageNumber(pageNum) {
    this.pageNum = pageNum;
  };

  beDisabledNextAndBackButton(pageNum) {
    if (pageNum === 1) {
      this.backwardDisable = 'disabled';
      this.forwardDisable = 'enabled';
    }
    else if (pageNum === this.totalOfPages) {
      this.backwardDisable = 'enabled';
      this.forwardDisable = 'disabled';
    }
    else {
      this.backwardDisable = 'enabled';
      this.forwardDisable = 'enabled';
    }
  };

}
